<template>
  <div class="base-project-detail">
    <div class="table w50">
      <div class="table-row-group" >
        <ul class="table-row">
          <li class="table-cell-title br0">项目编号</li>
          <li class="table-cell-content br0">{{formData.projectNo}}</li>
          <li class="table-cell-title br0">录入时间</li>
          <li class="table-cell-content">{{formData.createdTime}}</li>
        </ul>
      </div>
      <div class="table-row-group" >
        <ul class="table-row">
          <li class="table-cell-title br0">企业名称</li>
          <li class="table-cell-content br0">{{formData.userCompanyName}}</li>
          <li class="table-cell-title br0">客户名称</li>
          <li class="table-cell-content">{{formData.ownerName}}</li>
        </ul>
      </div>
      <div class="table-row-group" >
        <ul class="table-row">
          <li class="table-cell-title br0">冷库名称</li>
          <li class="table-cell-content br0">{{formData.storageName}}</li>
          <li class="table-cell-title br0">业务类型</li>
          <li class="table-cell-content">{{formData.tradeTypeDisplay}}</li>
        </ul>
      </div>
      <div class="table-row-group" >
        <ul class="table-row">
          <li class="table-cell-title br0">状态</li>
          <li class="table-cell-content br0">{{formData.statusDisplay}}</li>
          <li class="table-cell-title br0">资产总额（元）</li>
          <li class="table-cell-content">{{formData.totalAmount}}</li>
        </ul>
      </div>
      <div class="table-row-group" >
        <ul class="table-row">
          <li class="table-cell-title br0">申报折率</li>
          <li class="table-cell-content br0">{{formData.discountRateDeclareDisplay}}</li>
          <li class="table-cell-title br0">折后总价（元）</li>
          <li class="table-cell-content">{{formData.totalDiscountedAmountDeclare}}</li>
        </ul>
      </div>
      <div class="table-row-group" >
        <ul class="table-row">
          <li class="table-cell-title br0">建议折率</li>
          <li class="table-cell-content br0">{{replaceNull(formData.discountRateAdviceDisplay)}}</li>
          <li class="table-cell-title br0">风险系数</li>
          <li class="table-cell-content">{{replaceNull(formData.riskCoefficient)}}</li>
        </ul>
      </div>
    </div>
    <div v-if="productData != null && productData.length > 0">
      <div class="table-title">产品（单位：RMB）</div>
      <el-table class="table-content" :data="productData" border tooltip-effect="dark" max-height="600" style="width: 100%">
        <el-table-column align="center" prop="mainLevelCode" label="编码" width="77"></el-table-column>
        <el-table-column align="center" prop="mainProductName" label="产品" width="120"></el-table-column>
        <el-table-column align="center" prop="mainStandard" label="主标准" width="136"></el-table-column>
        <el-table-column align="center" prop="subStandard" label="二级标准" width="77"></el-table-column>
        <el-table-column align="center" prop="marketPrice" label="市价" width="77"></el-table-column>
        <el-table-column align="center" prop="adRatioDisplay" label="涨跌" width="77"></el-table-column>
        <el-table-column align="center" prop="discountRateAdviceDisplay" label="建议折率" width="77"></el-table-column>
        <el-table-column align="center" prop="flowCoefficient" label="流通系数" width="77"></el-table-column>
        <el-table-column align="center" prop="tradeUnitPrice" label="原值单价" width="80"></el-table-column>
        <el-table-column align="center" prop="tradeVolume" label="数量KG" width="103"></el-table-column>
        <el-table-column align="center" prop="tradeAmount" label="原值总价" width="111"></el-table-column>
        <el-table-column align="center" prop="discountRateDisplay" label="申报折率" width="77"></el-table-column>
        <el-table-column align="center" prop="discountedAmount" label="折后总价" width="111"></el-table-column>
        <el-table-column align="center" prop="discountedUnitPrice" label="折后单价" width="80"></el-table-column>
        <el-table-column align="center" prop="safePriceMargin" label="安全价差" width="77"></el-table-column>
      </el-table>
    </div>
  </div>
</template>
<script type="text/ecmascript-6">
  import PcDialog from 'components/dialog';
  export default{
    props: ['projectInfo'],
    components: {
      PcDialog
    },
    data() {
      return {
        formData: this.projectInfo,
        productData: null
      };
    },
    created() {
      this.initData();
    },
    methods: {
      // 根据项目ID获取项目产品列表
      initData() {
        this.ajax({
          url: '/malisk/server/project/queryProductList/' + this.formData.id,
          type: 'GET',
          success: (res) => {
            setTimeout(() => {
              this.$pcNProgress.done();
            }, 300);
            this.productData = res.result;
          }
        });
      },
      // 将null替换成"-"
      replaceNull(val) {
        return val === null ? '-' : val;
      }
    }
  };
</script>
<style>
  .base-project-detail {
    width: 1358px;
  }
  .base-project-detail .table{
    display:table;
    border-collapse:collapse;
    border:1px solid #e5e5e5;
    width:100%;
    background:#ffffff;
  }
  .base-project-detail .table .table-row-group{
    display:table-row-group;
    width: 100%;
    border-top: 1px solid #e5e5e5;
    border-left:1px solid #e5e5e5;
  }
  .base-project-detail .table .table-row-group .table-row{
    display:table-row;
    height: 40px;
  }
  .base-project-detail .table .table-row-group .table-row .table-cell-title{
    display:table-cell;
    padding:0 5px;
    border-left:1px solid #e5e5e5;
    border-right:1px solid #e5e5e5;
    height: 40px;
    width: 160px;
    line-height: 40px;
    text-align:center;
    color: #4d4d4d;
  }
  .base-project-detail .table .table-row-group .table-row .table-cell-content{
    display:table-cell;
    padding:0 5px;
    border-left:1px solid #e5e5e5;
    border-right:1px solid #e5e5e5;
    height: 40px;
    width: 320px;
    line-height: 40px;
    text-indent: 20px;
    color: #1a1a1a;
  }
  .base-project-detail .table .table-row-group .table-row .br0{
    border-right:none;
  }
  .base-project-detail .el-table--border td{
    border-right:1px solid #e5e5e5;
    border-bottom: 1px solid #e5e5e5;
  }
  .base-project-detail .table .w50 ul{
    box-sizing: border-box;
  }
  .base-project-detail .el-table--border td div{
    color:#000;
  }
  .base-project-detail .table-title{
    font-size:16px;
    color:#333333;
    border:1px solid #ebeef5;
    background:#fff;
    height: 50px;
    line-height:50px;
    padding-left:20px;
    margin-top:26px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin-bottom:-1px;
  }
</style>
